<template>
    <div class="member">
        <div class="top">
            <p class="biao"><img class="icon" src="@/assets/jiantou.png"> 执收单位管理</p>
        </div>
        <div class="op">
            <el-col :span='6'>
                <p class="name">执收单位名称:</p>
                <el-input v-model="input1" placeholder="执收单位名称"></el-input>
            </el-col>
            <el-col :span='6'>
                <p class="name">单位代码:</p>
                <el-input v-model="input1" placeholder="单位代码"></el-input>
            </el-col>
            <el-col :span="4" class="btn">
                <el-button type="primary" plain size="small" @click="toadd(':id')">查询</el-button>
                <el-button type="primary" size="small" @click="dialogFormVisible = true">新增单位</el-button>
            </el-col>
        </div>
        <!-- 添加类别弹框 -->
        <div class="my-dialog" v-show="dialogFormVisible">
            <el-form :model="form" label-position="right" :rules="rules">
                <el-col :span="24">
                    <p class="name">归属公司:</p>
                    <el-select v-model="value1" placeholder="陕西思普瑞集团">
                        <el-option
                        v-for="item in options1"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                        </el-option>
                    </el-select>
                </el-col>
                <el-col :span="24">
                    <p class="name">归属部门:</p>
                    <el-select v-model="value1" placeholder="陕西思普瑞集团">
                        <el-option
                        v-for="item in options1"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                        </el-option>
                    </el-select>
                </el-col>
                <el-col :span='24'>
                    <p class="name">工号:</p>
                    <el-input class="inp" v-model="input1" placeholder="工号"></el-input>
                </el-col>
                <el-col :span='24'>
                    <p class="name">姓名:</p>
                    <el-input class="inp" v-model="input1" placeholder="姓名"></el-input>
                </el-col>
                <el-col :span='24'>
                    <p class="name">登录名:</p>
                    <el-input class="inp" v-model="input1" placeholder="工号"></el-input>
                </el-col>
                <el-col :span='24'>
                    <p class="name">密码:</p>
                    <el-input class="inp" v-model="input1" placeholder="姓名"></el-input>
                </el-col>
                <el-col :span='24'>
                    <p class="name">确认密码:</p>
                    <el-input class="inp" v-model="input1" placeholder="工号"></el-input>
                </el-col>
                <el-col :span='24'>
                    <p class="name">邮箱:</p>
                    <el-input class="inp" v-model="input1" placeholder="姓名"></el-input>
                </el-col>
                <el-col :span='24'>
                    <p class="name">电话:</p>
                    <el-input class="inp" v-model="input1" placeholder="工号"></el-input>
                </el-col>
                <el-col :span='24'>
                    <p class="name">手机:</p>
                    <el-input class="inp" v-model="input1" placeholder="姓名"></el-input>
                </el-col>
                <el-col :span="24">
                    <p class="name">是否允许登录:</p>
                    <el-select v-model="value1" placeholder="陕西思普瑞集团">
                        <el-option
                        v-for="item in options1"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                        </el-option>
                    </el-select>
                </el-col>
                <el-col :span="24">
                    <p class="name">用户类型:</p>
                    <el-select v-model="value1" placeholder="陕西思普瑞集团">
                        <el-option
                        v-for="item in options1"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                        </el-option>
                    </el-select>
                </el-col>
                <el-col :span='24'>
                    <p class="name">用户角色:</p>
                    <el-input class="inp" v-model="input1" placeholder="工号"></el-input>
                </el-col>
                <el-col :span='24'>
                    <p class="name">备注:</p>
                    <el-input class="inp" v-model="input1" placeholder="姓名"></el-input>
                </el-col>
            </el-form>
            <div class="dialog-footer">
                <el-button type="primary" @click="addtype">保 存</el-button>
                <el-button @click="dialogFormVisible = false">取 消</el-button>
            </div>
        </div>
        <!-- 表格 -->
        <el-table
            :data="tableData" stripe style="width: 100%">
            <el-table-column fixed="left" prop="daiweicode" label="单位代码" width="150"></el-table-column>
            <el-table-column prop="danweiname" label="执收单位名称" min-width="150"></el-table-column>
            <el-table-column prop="code" label="组织机构代码" width="150"></el-table-column>
            <el-table-column prop="person" label="单位负责人" width="150"></el-table-column>
            <el-table-column prop="time" label="录入时间" min-width="150"></el-table-column>
            <el-table-column fixed="right" min-width="120">
                <template slot-scope="scope">
                    <el-button
                        @click.native.prevent="editgood(scope.$index, tableData4)"
                        type="text"
                        size="small">
                        修改
                    </el-button>
                    <el-button
                        @click.native.prevent="deleteRow(scope.$index, tableData4)"
                        type="text"
                        size="small" class="red">
                        删除
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
        <div class="block">
            <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page.sync="currentPage2"
            :page-sizes="[10, 20, 30, 40]"
            :page-size="10"
            layout="sizes, prev, pager, next"
            :total="1000">
            </el-pagination>
        </div>
    </div>
</template>

<script>
import api from '../../axios.js'

export default {
    data(){
        return{
            msg:'hhh',
            loading:true,
            dialogFormVisible: false,
            tabh:250,
            currentpage:1,
            pagesize:5,
            totalnum:100,
            currentPage2: 5,
            options1: [{
                value: '选项1',
                label: '黄金糕'
            }, {
                value: '选项2',
                label: '双皮奶'
            }, {
                value: '选项3',
                label: '蚵仔煎'
            }, {
                value: '选项4',
                label: '龙须面'
            }, {
                value: '选项5',
                label: '北京烤鸭'
            }],
            value1: '',
            input1:'',
            form: {
                name: ''
            },
            rules: {
                name: [
                    { required: true, message: '请输入商品名称', trigger: 'blur' }
                ]
            },
            formLabelWidth: '80px',
            tableData: [{
                daiweicode: '10001',
                danweiname: '西安市公安局',
                code: '10123456',
                person: '张飞',
                time:'2018-03-01'
            },{
                daiweicode: '10001',
                danweiname: '西安市公安局',
                code: '10123456',
                person: '张飞',
                time:'2018-03-01'
            }]
        };
    },
    created(){
        let params = {
            pagesize:this.pagesize,
            currentpage:this.currentpage
        }
        // api.getallgoods(params).then((data) => {
        //     let result = data.data
        //     if(result.status == 'success'){
        //         if(result.data){
        //             this.tableData4 = result.data
        //             this.loading = false
        //         }
                
        //     }else{
        //         this.loading = false
        //     }
        // })
        let h = this.winHeight() - 60 - 100
    },
    methods: {
        deleteRow(index, rows) {
            rows.splice(index, 1);
        },
        editgood(index, rows){
            let id = rows[index]._id
            console.log(id)
            this.$router.push('/addgood/'+id)
        },
        toadd(id){
            this.$router.push('/addgood/'+id)
            //this.$router.push({ name: 'addgood',params: { id: 0 } })
        },
        handleSizeChange(val) {
            console.log(`每页 ${val} 条`);
        },
        handleCurrentChange(val) {
            console.log(`当前页: ${val}`);
        },
        addtype(){
            let par = {
                typename:this.form.name
            }
            if(!this.form.name){
                this.$message({
                    message: '名称不能是空的哦～',
                    type: 'warning'
                });
            }else{
                api.addgoodtype(par).then((data) => {
                    let result = data.data
                    if(result.status == 'success'){
                        this.dialogFormVisible = false
                        this.form.name = ''
                        this.$message({
                            message:result.message,
                            type:'success'
                        })
                    }else{
                        this.$message({
                            message:result.message,
                            type:'error'
                        })
                    }
                })
            }
        }
    }
}
</script>

<style lang="stylus">

</style>